import config from "@/config";
import axios from "axios";
import { ElMessage } from "element-plus";

//自定义实例，添加根路径
const serve = axios.create({
    baseURL:config.baseApi
})
// const NETWORK_ERROR = "网络错误......"

// 添加请求拦截器
serve.interceptors.request.use(function (config) {
    // 在发送请求之前做些什么
    return config;
  }, function (error) {
    // 对请求错误做些什么
    return Promise.reject(error);
  });

// 添加响应拦截器
serve.interceptors.response.use((res) => {
    //res带回来的数据里面一般有状态码code，数据data，消息msg
    const {code,data,msg} = res.data
    if(code === 200){
        // 这里面的data相当于二次封装以后的数据了
        return data
    }else{
        const NETWORK_ERROR = "网络错误......"
        ElMessage.error(msg || NETWORK_ERROR)
        return Promise.reject(msg || NETWORK_ERROR)
    }
})

//写一个方法，这个方法 request 是一个封装的 HTTP 请求函数，用于简化和统一发送 HTTP 请求的过程
function request(options){
    options.method = options.method || "get" 

    //关于get请求参数的调整
    // toLowerCase() 是 JavaScript 中的一个字符串方法，用于将字符串中的所有字符转换为小写字母。
// 在 HTTP 中，GET 请求与 POST 请求有所不同。GET 请求通常是用来从服务器获取资源，不会带有请求体（request body）。它的数据会附加在 URL 的查询参数（query string）中，而不是请求体中。因此，GET 请求的数据应该以查询参数的形式传递。
// options.data：这通常是传递给请求的参数数据。对于 POST 或 PUT 请求，数据一般会放在请求体中。然而，对于 GET 请求，数据通常是通过 URL 的查询参数传递。
// options.params：axios 支持一种用 params 来传递 URL 查询参数的方式。params 会自动被序列化为查询字符串，并附加到 URL 后面。
// 这段代码的核心作用是针对 GET 请求，自动将请求数据（data）放到查询参数（params）中，从而确保数据以查询字符串的形式被添加到 URL。这样做符合 GET 请求的标准用法，即数据应通过 URL 传递，而不是放在请求体中。
    if(options.method.toLowerCase() === "get"){
        options.params = options.data
    }

    //对mock开关的一个处理
    let isMock = config.mock
    if(typeof options.mock !== "undefined"){
        isMock = options.mock
    }

    //针对环境的一个处理 prod是线上环境
    if(config.env === "prod"){
        //不能用mock
        serve.defaults.baseURL = config.baseURL
    }else{
        serve.defaults.baseURL = isMock ? config.mockApi : config.baseApi
    }

    return serve(options)
}

export default request

// 这段代码实现了一个 HTTP 请求封装，使用了 axios 进行网络请求，并通过请求和响应拦截器进行了自定义处理。它还考虑了不同的环境（如开发、生产）和是否启用 mock 数据的开关。
// 主要功能：
// 自定义 axios 实例：创建一个 axios 实例 serve，并设置了基础的 baseURL（从 config.baseApi 获取）。
// 请求拦截器：可以在请求发送之前对请求进行一些操作（例如，可以添加请求头等）。
// 响应拦截器：在接收到响应后，首先检查 code 是否为 200，若是则返回 data 数据。如果 code 不是 200，显示错误信息并返回拒绝的 Promise。
// 请求函数封装：request 函数是一个统一的 HTTP 请求函数，简化了请求的配置，支持 GET 和其他 HTTP 方法，并且处理了不同环境下的 API 基地址以及 mock 开关。


// request 函数接收一个 options 对象，用来配置请求。
// 默认请求方法为 GET，如果请求方法是 GET，则将 data 放入 params 中。
// mock 配置：如果 options.mock 被设置为 true，则使用 mock API 地址，否则使用正常的 API 地址。
// 根据不同环境，设置 baseURL：
// 如果是生产环境（prod），使用生产环境的 baseURL。
// 如果是开发环境或测试环境，根据 mock 开关选择 mockApi 或 baseApi。
// 最后，使用 axios 实例 (serve) 发起请求，并返回 axios 请求的结果。